<template>
    <div>
        <el-form :inline="true" :model="queryForm.data" class="demo-form-inline">
            <el-form-item >
                <el-select v-model="queryForm.data.professionCode" clearable placeholder="请选择专业" @change="selectProfession">
                    <el-option
                        v-for="item in options.professionCode"
                        :key="item.majorCode"
                        :label="item.majorName"
                        :value="item.majorCode">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary">查询</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
export default {
  name: "searchBar",
  data() {
    return {
      url: {
        professionOptions: "/datacenter/studentjob/query"
      },
      queryForm: {
        dialogFormVisible: false, //不允许弹出对话框
        data: {
          //专业
          professionCode: "",
        }
      },
      options: {
        professionCode: []
      }
    };
  },
  methods:{
      selectProfession: function(val) {
      let profession = {};
      profession = this.options.professionCode.find(item => {
        return item.majorCode === val;
      });
      console.log(profession.majorName);
      this.$emit("selectProCallBack",profession);
    }
  },
  mounted() {
    this.$http.get(this.url.professionOptions).then(
      (res) => {
        if (res.data.success) {
          this.options.professionCode = res.data.data;
         
          console.log("yes");
        } else {
          this.$message({
            type: "error",
            message: res.data.info
          });
        }
      },
      (res) => {
        this.$message({
          showClose: true,
          message: "网络错误,code=" + res.status,
          type: "error"
        });
      }
    );
  }
};
</script>
<style>
    
</style>

